<template>
  <div class="app-container customer-div">
    <el-menu :default-active="listQuery1.tab" class="el-menu-demo" mode="horizontal" @select="handleSelect">
      <el-menu-item index="all">全部货源</el-menu-item>
      <el-menu-item index="my">我的货源</el-menu-item>
    </el-menu>

    <div style="margin-top:40px">
      <el-form :inline="true" :model="listQuery1" size="mini" label-width="100px">
        <el-form-item label="发布时间：">
          <el-date-picker
            v-model="listQuery1.offerDate"
            type="daterange"
            format="yyyy 年 MM 月 dd 日"
            value-format="yyyy-MM-dd"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="品类：">
          <el-select v-model="listQuery1.goodsName" class="input-width" style="width:195px" placeholder="请选择" clearable>
            <el-option :value="item.goodsLineValue" :label="item.goodsLineValue" v-for="item in productLineList"  :key="item.goodsLineValue"></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="规格型号：">
          <el-select v-model="listQuery1.goodsKingId" filterable placeholder="请选择" clearable>
            <el-option
              v-for="item in goodsList"
              :key="item.kingId"
              :label="item.goodsSn"
              :value="item.kingId">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item>
          <el-button
            @click="handleSearchList1()"
            type="primary">
            查询
          </el-button>
          <el-button
            v-if="listQuery1.tab == 'my'"
            @click="showAddForm()"
            type="primary">
            批量货源报价
          </el-button>
        </el-form-item>
      </el-form>
    </div>
    <!--数据列表-->
    <div class="table-container">
      <el-table
        v-loading="listLoading1"
        :data="tableData1"
        border
        style="width: 100%; margin-top: 20px">
        <el-table-column
          label="采购员"
          min-width="100"
          align="center">
          <template slot-scope="scope">
            {{scope.row.offerUserName}}
          </template>
        </el-table-column>
        <el-table-column  label="品类" min-width="100" prop="orderSn" align="center">
          <template slot-scope="scope">
            {{scope.row.goodsName}}
          </template>
        </el-table-column>
        <el-table-column
          label="牌号"
          min-width="150"
          align="center">
          <template slot-scope="scope">
            {{scope.row.goodsSn}}
          </template>
        </el-table-column>
        <el-table-column
          label="数量"
          min-width="100"
          align="center">
          <template slot-scope="scope">
            {{scope.row.offerNum}}
          </template>
        </el-table-column>
        <el-table-column
          label="交期"
          min-width="100"
          align="center">
          <template slot-scope="scope">
            {{scope.row.deliverDays > 0 ? scope.row.deliverDays : '现货'}} <span v-show="scope.row.deliverDays > 0">天</span>
          </template>
        </el-table-column>
        <el-table-column
          label="地址"
          min-width="150"
          align="center">
          <template slot-scope="scope">
            {{scope.row.warehouseName}}
          </template>
        </el-table-column>
        <el-table-column
          label="付款方式"
          min-width="100"
          align="center">
          <template slot-scope="scope">
            {{scope.row.payType}}
          </template>
        </el-table-column>
        <el-table-column
          label="价格"
          min-width="100"
          align="center">
          <template slot-scope="scope">
            {{scope.row.goodsPrice}}
          </template>
        </el-table-column>
        <el-table-column
          label="交货方式"
          align="center"
          min-width="100">
          <template slot-scope="scope">
            {{scope.row.deliveryType}}
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          label="发布时间"
          min-width="150">
          <template slot-scope="scope">
            {{scope.row.offerTime}}
          </template>
        </el-table-column>
        <el-table-column
          label="更新时间"
          align="center"
          min-width="150">
          <template slot-scope="scope">
            {{scope.row.updateTime}}
          </template>
        </el-table-column>
        <el-table-column
          label="已订数量"
          align="center"
          min-width="100">
          <template slot-scope="scope">
            {{scope.row.orderNum}}
          </template>
        </el-table-column>
        <el-table-column
          label="剩余"
          min-width="100"
          align="center">
          <template slot-scope="scope">
              {{scope.row.offerNum | fifNum(scope.row.orderNum)}}
          </template>
        </el-table-column>

        <el-table-column
          width="100"
          fixed="right"
          label="操作"
          align="center">
          <template slot-scope="scope">
            <el-button
              v-if="listQuery1.tab == 'my'"
              type="text"
              size="mini"
              @click="showEditForm(scope.row)">修改
            </el-button>
            <el-button
              type="text"
              size="mini"
              @click="showYudingForm(scope.row)">预定
            </el-button>
            <el-button
              type="text"
              size="mini"
              @click="showGodsOrderList(scope.row)">明细
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="pagination-container">
      <el-pagination
        background
        @size-change="handleSizeChange1"
        @current-change="handleCurrentChange1"
        layout="total, sizes,prev, pager, next,jumper"
        :current-page.sync="listQuery1.pageNum"
        :page-size="listQuery1.pageSize"
        :page-sizes="[10,15,20]"
        :total="count1">
      </el-pagination>
    </div>


    <!--批量货源报价-->
    <el-dialog
      :close-on-click-modal="false"
      title="批量货源报价"
      :visible.sync="dialogVisible"
      width="1000px">
      <el-form :model="addForm" size="small" label-width="100px" ref="addForm" :rules="rules">
        <el-form-item label="" label-width="0px">
          <div><el-button type="text" @click="addGoods">新增货源</el-button></div>
          <el-table :data="addForm.offerList" border>
            <el-table-column
              min-width="200"
              label="牌号"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.kingGoodsId`" :rules="rules.kingGoodsId" label-width="0px">
                  <el-select
                    @change="changeGoods(scope.$index,scope.row.kingGoodsId)"
                    size="small"
                    v-model="scope.row.kingGoodsId"
                    filterable
                    remote
                    placeholder="请输入关键词"
                    :remote-method="((val)=>{remoteMethod(val, scope.$index)})"
                    :loading="goodsLoading">
                    <el-option
                      v-for="item in scope.row.list"
                      :key="item.id"
                      :label="item | fifitem"
                      :value="item.kingGoodsId">
                    </el-option>
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="数量"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.offerNum`" :rules="rules.offerNum" label-width="0px">
                  <el-input v-model="scope.row.offerNum"  size="small"  style="width:65%"></el-input><span style="padding-left:10px;">吨</span>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="付款方式"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.payType`" :rules="rules.payType" label-width="0px">
                   <el-select v-model="scope.row.payType">
                     <el-option value="现金" label="现金"></el-option>
                     <el-option value="承兑" label="承兑"></el-option>
                   </el-select>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="价格"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.goodsPrice`" :rules="rules.goodsPrice" label-width="0px">
                  <el-input v-model="scope.row.goodsPrice"  size="small"  style="width:65%"></el-input><span style="padding-left:10px;">/吨</span>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="地址"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.warehouseName`" :rules="rules.warehouseName" label-width="0px">
                  <el-input v-model="scope.row.warehouseName"  size="small" ></el-input>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="交期"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.deliverDays`" :rules="rules.deliverDays" label-width="0px">
                  <el-input v-model="scope.row.deliverDays"  size="small"  style="width:65%"></el-input><span style="padding-left:10px;">天</span>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="交货方式"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.deliveryType`" :rules="rules.deliveryType" label-width="0px">
                  <el-select v-model="scope.row.deliveryType">
                    <el-option value="自提" label="自提"></el-option>
                    <el-option value="送到" label="送到"></el-option>
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="备注"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item  label-width="0px">
                  <el-input v-model="scope.row.offerRemark"  size="small" ></el-input>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="操作"
              min-width="80"
              align="center">
              <template slot-scope="scope">
                <el-button type="text" @click="delGoods(scope.$index)" :disabled="scope.$index==0">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose">取 消</el-button>
          <el-button type="primary" @click="handleConfirm" :loading="btnLoading">发 布</el-button>
      </span>
    </el-dialog>

    <!--预定-->
    <el-dialog
      :close-on-click-modal="false"
      title="预定"
      :visible.sync="dialogVisible2"
      width="320px">
      <el-form :model="yudingForm" size="mini" label-width="60px" ref="yudingForm" :rules="rules2" >
        <el-alert
          title="预定数量不可超过剩余数量"
          type="warning"
          style="margin-bottom:15px;"
          :closable="false">
        </el-alert>
        <el-form-item label="剩余：">
          <div style="font-weight: bold">{{yudingForm.maxNum}} 吨</div>
        </el-form-item>
        <el-form-item label="数量：" prop="orderNum">
          <el-input-number v-model="yudingForm.orderNum" controls-position="right" :min="0" :max="yudingForm.maxNum" :precision="4" :controls="false"></el-input-number>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose2">取 消</el-button>
          <el-button type="primary" @click="handleConfirm2" :loading="btnLoading2">确 定</el-button>
      </span>
    </el-dialog>

    <!--编辑货源报价-->
    <el-dialog
      :close-on-click-modal="false"
      title="编辑货源报价"
      :visible.sync="dialogVisible3"
      width="1000px">
      <el-form :model="editForm" size="small" label-width="100px" ref="editForm" :rules="rules">
        <el-form-item label="" label-width="0px">
          <el-table :data="editForm.offerList" border>
            <el-table-column
              min-width="200"
              label="牌号"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.kingGoodsId`" :rules="rules.kingGoodsId" label-width="0px">
                  <el-select
                    @change="changeGoods2(scope.$index,scope.row.kingGoodsId)"
                    size="small"
                    v-model="scope.row.kingGoodsId"
                    filterable
                    remote
                    placeholder="请输入关键词"
                    :remote-method="((val)=>{remoteMethod2(val, scope.$index)})"
                    :loading="goodsLoading">
                    <el-option
                      v-for="item in scope.row.list"
                      :key="item.kingGoodsId"
                      :label="item | fifitem"
                      :value="item.kingGoodsId">
                    </el-option>
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="数量"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.offerNum`" :rules="rules.offerNum" label-width="0px">
                  <el-input v-model="scope.row.offerNum"  size="small"  style="width:65%"></el-input><span style="padding-left:10px;">吨</span>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="付款方式"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.payType`" :rules="rules.payType" label-width="0px">
                  <el-select v-model="scope.row.payType">
                    <el-option value="现金" label="现金"></el-option>
                    <el-option value="承兑" label="承兑"></el-option>
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="价格"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.goodsPrice`" :rules="rules.goodsPrice" label-width="0px">
                  <el-input v-model="scope.row.goodsPrice"  size="small"  style="width:65%"></el-input><span style="padding-left:10px;">/吨</span>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="地址"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.warehouseName`" :rules="rules.warehouseName" label-width="0px">
                  <el-input v-model="scope.row.warehouseName"  size="small" ></el-input>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="交期"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.deliverDays`" :rules="rules.deliverDays" label-width="0px">
                  <el-input v-model="scope.row.deliverDays"  size="small"  style="width:65%"></el-input><span style="padding-left:10px;">天</span>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="交货方式"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item :prop="`offerList.${scope.$index}.deliveryType`" :rules="rules.deliveryType" label-width="0px">
                  <el-select v-model="scope.row.deliveryType">
                    <el-option value="自提" label="自提"></el-option>
                    <el-option value="送到" label="送到"></el-option>
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="备注"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                <el-form-item  label-width="0px">
                  <el-input v-model="scope.row.offerRemark"  size="small" ></el-input>
                </el-form-item>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose3">取 消</el-button>
          <el-button type="primary" @click="handleConfirm3" :loading="btnLoading3">发 布</el-button>
      </span>
    </el-dialog>


    <!--预定明细-->
    <el-dialog
      :close-on-click-modal="false"
      title="预定明细"
      :visible.sync="dialogVisible4"
      width="1000px">
          <el-table :data="goodsOrderList" border>
            <el-table-column
              label="预订数量"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                  {{scope.row.orderNum}}
              </template>
            </el-table-column>

            <el-table-column
              label="业务员"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                  {{scope.row.orderUserName}}
              </template>
            </el-table-column>

            <el-table-column
              label="付款方式"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                {{scope.row.payType}}
              </template>
            </el-table-column>

            <el-table-column
              label="采购报价"
              min-width="100"
              align="center">
              <template slot-scope="scope">
                {{scope.row.orderPrice}}
              </template>
            </el-table-column>

            <el-table-column
              label="预定时间"
              min-width="150"
              align="center">
              <template slot-scope="scope">
                {{scope.row.createTime}}
              </template>
            </el-table-column>
            <el-table-column
              label="操作"
              min-width="80"
              align="center">
              <template slot-scope="scope">
                <el-button type="text" @click="cancelGoods(scope.row)">取消</el-button>
              </template>
            </el-table-column>
          </el-table>


    </el-dialog>


  </div>
</template>
<script>
import axios from 'axios'
import {getOrderUsersList,getCustomerSetting,orderGoodsList,gegtGoodsSourceList} from '@/api/partner'
import {formatDate} from '@/utils/date';
import store from '@/store'
import { mapGetters } from 'vuex'
import {
  addGoodsSource,
  editGoodsSource,
  getCrmGoodsList,
  getGoodsOrderList,
  goodsLineList,
  goodsOrderCancel,
  goodsSourceOrder,
} from "../../api/partner";
let time = new Date();
let startDate = formatDate(time, 'yyyy-MM-dd');
const defaultListQuery={
  "offerDate" : [startDate,startDate], //#询价时间
  "goodsName" : "",  //品类
  "goodsKingId" : '', //商品SAPID
  tab:'all',
  "pageNum"  : 1,
  "pageSize" : 10
};



const defaultAddForm={
  "offerList" : [
    {
      "goodsName" : "",   //商品品类
      "goodsSn" : "", //牌号
      "kingGoodsId" : null, //商品SAPID
      "offerNum" : '', //数量
      "payType" : "现金", //支付方式
      "goodsPrice" : '', //价格
      "warehouseName" : "", //地址
      "deliverDays" : '', //交货期(0表示现货)
      "deliveryType" : "送到", //交货方式
      "offerRemark" : "", //备注
      list:[],
    }
  ],
  "inquiryRemark" : ""  //备注

};

const defaultGoodsItem={
  "goodsName" : "",   //商品品类
  "goodsSn" : "", //牌号
  "kingGoodsId" : null, //商品SAPID
  "offerNum" : '', //数量
  "payType" : "现金", //支付方式
  "goodsPrice" : '', //价格
  "warehouseName" : "", //地址
  "deliverDays" : '', //交货期(0表示现货)
  "deliveryType" : "送到", //交货方式
  "offerRemark" : "", //备注
  list:[],
};

const defaultYudingForm={
  "offerId" : '',  //货源ID
  "orderNum" : '',  //预定数量
  maxNum:'',//最大数量
};

export default {
  name: "index",
  data(){
    return {
      roles:store.getters.roles ? store.getters.roles : [],
      listQuery1: JSON.parse(JSON.stringify(defaultListQuery)),
      tableData1: [],
      count1: 0,
      listLoading1: false,
      goodsList:[],
      userOptionList:[],

      addForm:JSON.parse(JSON.stringify(defaultAddForm)),
      dialogVisible:false,
      btnLoading:false,
      customerIndustryList:[],
      options:[],
      goodsLoading:false,
      rules:{
        kingGoodsId:[{required: true, message: '此项必填', trigger: 'change'},],
        offerNum:[{required: true, message: '此项必填', trigger: 'change'},],
        payType:[{required: true, message: '此项必填', trigger: 'change'},],
        goodsPrice:[{required: true, message: '此项必填', trigger: 'blur'},],
        warehouseName:[{required: true, message: '此项必填', trigger: 'change'},],
        deliverDays:[{required: true, message: '此项必填', trigger: 'blur'},],
        deliveryType:[{required: true, message: '此项必填', trigger: 'change'},],
      },

      dialogVisible2:false,
      yudingForm:JSON.parse(JSON.stringify(defaultYudingForm)),
      btnLoading2:false,
      rules2:{
        orderNum:[{required: true, message: '此项必填', trigger: 'change'},],
      },

      reasonList:[],
      productLineList:[],

      editForm:JSON.parse(JSON.stringify(defaultAddForm)),
      dialogVisible3:false,
      btnLoading3:false,

      dialogVisible4:false,
      goodsOrderList:[],
    }
  },
  computed: {
    ...mapGetters([
      'name',
      'mobile',
      'userId'
    ]),
    inquiryExport(){
      if(this.roles.indexOf("inquiryExport") != -1){
        return true
      }else{
        return false
      }
    },
  },
  created() {
    this.getUserOptionList();
    orderGoodsList().then((res)=>{
      this.goodsList = res.list
    })
    //获取产品线选项列表
    goodsLineList().then((res)=>{
      this.productLineList = res;
    })
    this.getList1();
  },
  filters: {
    fifitem(item){
      return item.goodsName+'/'+item.goodsSn
    },
    fifInquiryState(val){
      if(val == 0){
        return '待报价'
      }else if(val == 5){
        return '询价中'
      }else if(val == 10){
        return '已取消'
      }else if(val == 15){
        return '已过期'
      }else if(val == 20){
        return '已报价'
      }else if(val == 30){
        return '未成交'
      }else if(val == 40){
        return '已成交'
      }
    },
    fifNum(val1,val2){
      return (parseFloat(val1) - parseFloat(val2)).toFixed(4)
    },
  },
  methods:{
    //取消预定
    cancelGoods(item){
      this.$confirm('是否确认取消', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        goodsOrderCancel({orderId:item.orderId}).then(()=>{
          this.getList1();
          getGoodsOrderList({offerId:item.offerId}).then((res)=>{
            this.goodsOrderList = res.list;
          })
          this.$message({
            type: 'success',
            message: '取消成功!'
          });
        })

      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        });
      });
    },
    //显示预定明细
    showGodsOrderList(item){
      this.dialogVisible4 = true;
      getGoodsOrderList({offerId:item.offerId}).then((res)=>{
          this.goodsOrderList = res.list;
      })
    },
    changeInquiryState(val){
      this.handleSearchList1();
    },
    //获取销售询价列表
    getList1(){
      this.listLoading1 = true;
      let listQuery = JSON.parse(JSON.stringify(this.listQuery1));
      gegtGoodsSourceList(listQuery).then(response => {
        this.tableData1 = response.list;
        this.count1 = response.count;
        this.listLoading1 = false;
      }).catch(()=>{
        this.listLoading1 = false;
      });
    },

    handleSizeChange1(val){
      this.listQuery1.pageNum = 1;
      this.listQuery1.pageSize = val;
      this.getList1();
    },
    handleCurrentChange1(val){
      this.listQuery1.pageNum = val;
      this.getList1();
    },

    handleSearchList1(){
      this.listQuery1.pageNum = 1;
      this.getList1();
    },




    //联想商品
    remoteMethod(key,index){
      this.goodsLoading = true;
      getCrmGoodsList({keyword:key}).then((res)=>{
        this.addForm.offerList[index].list = res;
        this.goodsLoading = false;
      }).catch(()=>{
        this.goodsLoading = false;
      })
    },

    //切换商品
    changeGoods(index,kingGoodsId){
      let c = {};
      c = this.addForm.offerList[index].list.find((el)=>{
        return el.kingGoodsId == kingGoodsId;
      });
      let data = JSON.parse(JSON.stringify(this.addForm.offerList[index]));
      data.kingGoodsId = c.kingGoodsId;
      data.goodsName = c.goodsName;
      data.goodsSn = c.goodsSn;
      this.addForm.offerList.splice(index,1,data);
      console.log("data",data);
      console.log("this.addForm",this.addForm)
    },

    //获取客户配置
    getCustomerSettingList(){
      getCustomerSetting().then((res)=>{
        res.forEach((el)=>{
          if(el.cdtCode == 'customer_industry'){
            this.customerIndustryList = el.data;
          }
        });
      })
    },

    //新增询价商品
    addGoods(){
      let item = JSON.parse(JSON.stringify(defaultGoodsItem))
      this.addForm.offerList.push(item)
      console.log("this.addForm",this.addForm)
    },

    //删除询价商品
    delGoods(index){
      this.addForm.offerList.splice(index,1);
    },

    //显示预定弹窗
    showYudingForm(item){
      this.dialogVisible2 = true;
      this.yudingForm = JSON.parse(JSON.stringify(defaultYudingForm));
      this.yudingForm.offerId = item.offerId;
      this.yudingForm.maxNum = parseFloat((parseFloat(item.offerNum) - parseFloat(item.orderNum)).toFixed(4));
    },

    //关闭取消或未成交原因弹窗
    handleClose2(){
      this.dialogVisible2 = false;
      this.btnLoading2 = false;
    },

    //提交预定
    handleConfirm2(){
      this.$refs.yudingForm.validate((valid) => {
        if (valid) {
          this.btnLoading2 = true;
          goodsSourceOrder(this.yudingForm).then((res)=>{
            this.$message({
              type: 'success',
              message: '操作成功!'
            });
            this.btnLoading2 = false;
            this.handleClose2();
            this.getList1();
          }).catch(()=>{
            this.btnLoading2 = false;
          })
        }
      })

    },

    //联想商品
    remoteMethod2(key,index){
      this.goodsLoading = true;
      getCrmGoodsList({keyword:key}).then((res)=>{
        this.editForm.offerList[index].list = res;
        this.goodsLoading = false;
      }).catch(()=>{
        this.goodsLoading = false;
      })
    },

    //切换商品
    changeGoods2(index,kingGoodsId){
      let c = {};
      c = this.editForm.offerList[index].list.find((el)=>{
        return el.kingGoodsId == kingGoodsId;
      });
      let data = JSON.parse(JSON.stringify(this.editForm.offerList[index]));
      data.kingGoodsId = c.kingGoodsId;
      data.goodsName = c.goodsName;
      data.goodsSn = c.goodsSn;
      this.editForm.offerList.splice(index,1,data);
      console.log("data",data);
      console.log("this.editForm",this.editForm)
    },



    //显示新增询价弹窗
    showAddForm(item){
      this.dialogVisible = true;
      this.addForm = JSON.parse(JSON.stringify(defaultAddForm));
    },
    //关闭新增询价弹窗
    handleClose(){
      this.dialogVisible = false;
      this.btnLoading = false;
    },

    //确认新增询价
    handleConfirm(){
      this.$refs.addForm.validate((valid) => {
        if (valid) {
          this.btnLoading = true;
          let data = {};
          data.offerList = [];
          this.addForm.offerList.forEach((el)=>{
            data.offerList.push({
              goodsName:el.goodsName,
              goodsSn:el.goodsSn,
              kingGoodsId:el.kingGoodsId,
              offerNum:el.offerNum,
              payType:el.payType,
              goodsPrice:el.goodsPrice,
              warehouseName:el.warehouseName,
              deliverDays:el.deliverDays,
              deliveryType:el.deliveryType,
              offerRemark:el.offerRemark
            })
          })
          addGoodsSource(data).then((res)=>{
            this.$message({
              type: 'success',
              message: '操作成功!'
            });
            this.btnLoading = false;
            this.handleClose();
            this.getList1();
          }).catch(()=>{
            this.btnLoading = false;
          })
        }
      })

    },


    //显示编辑询价弹窗
    showEditForm(item){
      this.dialogVisible3 = true;
      this.editForm = JSON.parse(JSON.stringify(defaultAddForm));
      this.editForm.offerId = item.offerId;
      this.editForm.offerList = [];
      this.editForm.offerList.push({
        goodsName : item.goodsName ,
        goodsSn : item.goodsSn,
        kingGoodsId : item.kingGoodsId,
        offerNum : item.offerNum,
        payType : item.payType,
        goodsPrice : item.goodsPrice,
        warehouseName : item.warehouseName,
        deliverDays : item.deliverDays,
        deliveryType : item.deliveryType,
        offerRemark : item.offerRemark,
        list:[]
      })
      let c={
        kingGoodsId:item.kingGoodsId,
        goodsName : item.goodsName ,
        goodsSn : item.goodsSn,
      };
      this.editForm.offerList[0].list.splice(0,1,c);
      console.log(this.editForm)
    },

    //关闭编辑询价弹窗
    handleClose3(){
      this.dialogVisible3 = false;
      this.btnLoading3 = false;
    },

    //确认编辑询价
    handleConfirm3(){
      this.$refs.editForm.validate((valid) => {
        if (valid) {
          this.btnLoading3 = true;
          let data = {};
          data.offerId = this.editForm.offerId;
          data.goodsName = this.editForm.offerList[0].goodsName;
          data.goodsSn = this.editForm.offerList[0].goodsSn;
          data.kingGoodsId = this.editForm.offerList[0].kingGoodsId;
          data.offerNum = this.editForm.offerList[0].offerNum;
          data.payType = this.editForm.offerList[0].payType;
          data.goodsPrice = this.editForm.offerList[0].goodsPrice;
          data.warehouseName = this.editForm.offerList[0].warehouseName;
          data.deliverDays = this.editForm.offerList[0].deliverDays;
          data.deliveryType = this.editForm.offerList[0].deliveryType;
          data.offerRemark = this.editForm.offerList[0].offerRemark;
          editGoodsSource(data).then((res)=>{
            this.$message({
              type: 'success',
              message: '操作成功!'
            });
            this.btnLoading3 = false;
            this.handleClose3();
            this.getList1();
          }).catch(()=>{
            this.btnLoading3 = false;
          })
        }
      })

    },


    //获取员工下拉选项
    getUserOptionList(){
      getOrderUsersList().then((res)=>{
        this.userOptionList = res;
      })
    },


    /**
     * 切换选择状态
     */
    handleSelect(key, keyPath){
      this.listQuery1 = JSON.parse(JSON.stringify(defaultListQuery));
      this.listQuery1.tab = key;
      this.handleSearchList1();
    },



  },
}
</script>

<style scoped lang="scss">
.upload-div{
  text-align: center;
  position:relative;
  #upload{

    opacity: 0;
    position: absolute;
    z-index: 1;
    width:154px;
    height:40px
  }
}
.title-tab{
  border-radius: 8px;
  background: #eee;
  margin-left: 10px;
  display: inline-block;
  vertical-align: middle;
  line-height: 20px;
  padding: 0 5px;
  color: #666;
}
</style>
